<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <!-- 引入ElementUI样式 -->
    <link type="text/css" rel="stylesheet" href="../css/index.css">
    <!-- 引入Vue组件库 -->
    <script type="text/javascript" src="../js/vue.js"></script>
    <!-- 引入ElementUI组件库 -->
    <script type="text/javascript" src="../js/index.js"></script>
    <script type="text/javascript" src="../js/axios.min.js"></script>

    <link type="text/css" rel="stylesheet" href="../css/indexmain.css">
</head>
<body>
<div id="app">

    <!--header-->
    <el-row>
        <el-col :span="18" :offset="3">
            <div class="grid-content bg-purple">
                <img src="../img/logo.png" >
                <div class="header">
                    <ul>
                        <li>
                            <a href="/login.html" ><div class="icon-nav">
                                <i class="el-icon-user"></i>
                            </div><span class="nav-txt">信息门户</span></a>
                        </li>
                        <li>
                            <a href="/static/reservation.jsp" ><div class="icon-nav">
                                <i class="el-icon-phone-outline"></i>
                            </div><span class="nav-txt">用户预约</span></a>
                        </li>
                        <li>
                            <a href="/login.html" ><div class="icon-nav">
                                <i class="el-icon-loading"></i>
                            </div><span class="nav-txt">English</span></a>
                        </li>
                        <li>
                            <a href="/login.html" ><div class="icon-nav">
                                <i class="el-icon-search"></i>
                            </div><span class="nav-txt">查询更多</span></a>
                        </li>
                    </ul>
                </div>
            </div>
        </el-col>
    </el-row>

    <!--menu-->
    <el-row>
        <el-col :span="24"><div class="grid-content bg-purple-dark">
            <el-row>
                <el-col :span="18" :offset="3"><div class="grid-content bg-purple-dark">
                    <div id="menu">
                        <div class="nav">
                            <ul v-for="menu in indexMenu"  :key="menu.id">
                                <li>
                                    <a :href="menu.id==1?menu.titleHref:'/static/template.jsp?id='+menu.id" :title="menu.titleName">{{menu.titleName}}</a>
                                    <div class="two-nav" >
                                        <a v-for="c in menu.children" :href="c.id==1?c.titleHref:'/static/template.jsp?id='+c.id" :title="c.titleName">{{c.titleName}}</a>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div></el-col>
            </el-row>
        </div></el-col>
    </el-row>

    <%--填加数据--%>
    <el-row>
        <el-col :span="18" :offset="3">
            <div class="grid-content bg-purple">
                <div class="yq-banner">

                    <div style="min-height: 600px;font-size: 20px">
                        <h1 style="text-align: center;margin: 20px">{{news.title}}</h1>
                        <div style="float: right ;margin-right: 40px">
                            <span style="color: chocolate;font-weight: bolder;margin-right: 30px">作者：{{news.user}}</span>
                            <span style="color: dimgrey">发布时间：{{news.time}}</span>
                        </div>
                        <hr style="margin-top: 60px;margin-bottom: 20px">

                        <pre style="line-height: 40px; word-wrap: break-word;white-space: pre-wrap;">{{news.content}}</pre>

                        <div style="float: right ;margin: 40px;">
                            <span style="color: darkgreen"><i class="el-icon-thumb"></i> 点击量：{{news.click}}</span>
                            <span style="margin-left: 20px">审核人：{{news.user}}</span>
                        </div>
                    </div>

                </div>
            </div>
        </el-col>
    </el-row>

    <!--footer-->
    <div id="footer">
        <div class="fot_bg">
            <div class="fot_bg_left">
                <p>地 址 : P屏南县古峰镇长汾社区梨园路120号 &nbsp;Address: No. 1, Xianghe Road, Xinzheng, P. R. China<br>邮 编 : 451191
                    &nbsp; &nbsp;招生电话: 0371-62508666 &nbsp; &nbsp;451191 &nbsp; TEL: +86-0371-62508666<br>版权所有 :
                    Copyright©2007-2022 Henan University of Engineering , - 网站地图 - <span><img
                            src="" title="" alt=""
                            width="16" height="16"></span><a href="https://beian.miit.gov.cn/">豫ICP备
                        14017577号-2</a></p>
            </div>
        </div>
        <div class="fot_bg_mid">
            <ul>
                <li><img src="../img/fw/wb_img.png"><span>官方微博</span>
                </li>
                <li><img src="../img/fw/wx_img.png"><span>官方微信</span>
                </li>

            </ul>
        </div>
        <div class="fot_bg_right">
            <ul>
                <li><a href="" title=""
                       onclick='_addDynClicks("wburl", 1681657356, 59790)'>新闻网</a></li>
                <li><a href="" title=""
                       onclick='_addDynClicks("wburl", 1681657356, 59791)'>招聘网</a></li>
                <li><a href="" title=""
                       onclick='_addDynClicks("wburl", 1681657356, 59792)'>人才引进</a></li>
                <li><a href="" title="" onclick='_addDynClicks("wburl", 1681657356, 59793)'>校历</a></li>
                <li><a href="" title="" onclick='_addDynClicks("wburl", 1681657356, 59794)'>医院地图</a></li>
            </ul>
        </div>
        <div class="clear"></div>
    </div>

</div>

<script>
    new Vue({
        el: "#app",
        data: {
            indexMenu:[],
            editableTabs: [],
            url:'',
            id:'',
            news:'',
        },
        created() {
            this.initMenu();
            this.id = <%= request.getParameter("id")%>;
            axios.get("/indexTitle/newkind2ById?id="+this.id).then(resp=>{
                this.news = resp.data.data;
                console.log(this.news);
            })
        },
        methods: {
            initMenu(){
                axios.get("/indexTitle/menu").then(resp=>{
                    this.indexMenu = resp.data.data.menu;
                })
            },

            initUrl(){
                axios.get("/indexTitle/findById?id="+this.id).then(resp=>{
                    this.url = resp.data.data.titleHref;
                })
            }

        },
    })
</script>
</body>
</html>